<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>css常见样式属性</title>
    <link rel="stylesheet" href="css_six.css">
</head>
<body class="bg_dome6">
    <p class="value_px">绝对单位： px</p>
    <p class="value_em">相对单位：em</p>
    <p class="value_rem">相对单位：rem</p>
    <p class="color_name">颜色值：名称</p>
    <p class="class_hex">颜色值：十六进制</p>
    <p class="color_fun">颜色值：函数值rgb</p>
    <p class="img_url">图片url函数</p>
    <p class="font_demo">字体样式展示  font style  demo </p>
    <p class="text_demo">文本样式展示 abc</p>
    <ul class="list_demo4">
        <li>项1</li>
        <li>项2</li>
        <li>项3</li>
    </ul>

    <div class="bg_box bg_demo1">
        背景样式:颜色
    </div>
    <div class="bg_box bg_demo2">
        背景样式：图片
    </div>
      
     <div class="bg_box bg_demo3">
         背景样式：图片重复

     </div>
     <div class="bg_box bg_demo4">
         背景样式：图片位置
     </div>

     <table>
         <caption>学生信息表</caption>
         <thead>
             <tr>
                 <th>学号</th>
                 <th>姓名</th>
                 <th>总分</th>
                 <th>排名</th>
             </tr>
         </thead>
         <tbody>
             <tr>
                 <td>20190203821</td>
                 <td>王一</td>
                 <td>620</td>
                 <td>2</td>
             </tr>
             <tr>
                <td>20190203822</td>
                <td>李二</td>
                <td>630</td>
                <td>1</td>
            </tr>
            <tr>
                <td>20190203823</td>
                <td>张三</td>
                <td>590</td>
                <td>4</td>
            </tr>
            <tr>
                <td>20190203824</td>
                <td>陈四</td>
                <td>600</td>
                <td>3</td>
            </tr>

         </tbody>


         <tfoot>
             <tr> 
                 <td colspan="4">人数总计4</td>
             </tr>

         </tfoot>
     
        </table>



        <div class="form_demo">
            <form action="">
                <!-- <fieldset> -->
                    <!-- <legend>登入信息</legend> -->
                    <p>
                        <!-- <label for="username">用户名</label> -->
                        <input type="text"  name="username" id="username">
                    </p>
                    <p>
                        <!-- <label for="pwd">密码</label> -->
                        <input type="password" name="pwd" id="pwd">
                    </p>
                <!-- </fieldset> -->
                <input type="submit" value="登录">
            </form>
        </div>
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>

</body>
</html>